<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>有货</title>
	<link rel="stylesheet" type="text/css" href="./Public/Home/org/bootstrap-3.3.5-dist/css/bootstrap.min.css" />
	<!-- <script src="./Public/Home/org/bootstrap-3.3.5-dist/js/bootstrap.min.js" type="text/javascript" charset="utf-8"></script> -->
	<script type="text/javascript" src="./Public/Home/Js/jquery-1.8.2.min.js"></script>
	<link rel="stylesheet" href="./Public/Home/Swiper-3.3.1/dist/css/swiper.min.css">
	<script type="text/javascript" src="./Public/Home/Swiper-3.3.1/dist/js/swiper.jquery.min.js"></script>
	<script type="text/javascript" src="./Public/Home/Swiper-3.3.1/dist/js/swiper.min.js"></script>
	<link rel="stylesheet" href="./Public/Home/Css/index.css">
	<link rel="stylesheet" href="./Public/Home/Css/common.css">
	<script type="text/javascript" src="./Public/Home/Js/index.js"></script>
	<link rel="stylesheet" href="./Public/Home/Css/list.css">
	<script type="text/javascript" src="./Public/Home/Js/list.js"></script>
	<link rel="stylesheet" href="./Public/Home/Css/show.css">
	<script type="text/javascript" src="./Public/Home/Js/show.js"></script>
</head>
<body>
 {{include file="../Common/header"}}

<!-- 中部内容 -->
<article>
	<div id="brand-banner">
		<div class="brand-top">
			<a href="" class="brand-left">
				<img src="./Public/Home/Images/show/1.jpg" alt="">
			</a>
			<a href="" class="brand-right">
				<span class="BRimg"></span>
				<span class="BRimg2"></span>
			</a>
		</div>
	</div>
	<div id="content-all">
		<div id="_list-top">
			<a href="">BOYS首页</a>
			<span>></span>
			<a href="">BOYS首页</a>
			<span>></span>
		</div>
	</div>	
	<div id="_show-total">
		<div class="_show">
			<div class="_show-left-more">
				<!-- 循环点开始大图的循环 对应下面的选颜色图片-->
				<div class="_show-left">
					<!-- 左边大图的显示 -->
					<div class="_show-big">
						<img src="{{$totalData['big'][0]}}" alt="">
					</div>
					<!-- 中间缩略图的显示 -->
					<div class="_show-thumb">
						{{foreach from="$totalData['medium']" value="$value"}}
							<li><img src="{{$value}}" alt=""></li>
						{{endforeach}}
					</div>
				</div>
				<!-- 循环点结束 -->
			</div>
			<script type="text/javascript">
				$(function(){
					$('._show-thumb li').mouseover(function(){
						var n = $(this).index();
						// console.log(n);
						switch(n){
							case 0:
							$(this).closest('._show-left').find('._show-big img').attr('src','<?php echo $totalData['big'][0] ?>');
							break;
							case 1:
							$(this).closest('._show-left').find('._show-big img').attr('src','<?php echo $totalData['big'][1] ?>');
							break;
							case 2:
							$(this).closest('._show-left').find('._show-big img').attr('src','<?php echo $totalData['big'][2] ?>');
							break;
						}
					})
				})
			</script>
			<div class="_show-right">
				<p class="_show-name">
					<span class="_show-list-name" id="GName">{{$totalData['gname']}}</span>
					<span class="sale-tip">春潮新势力</span>
				</p>
				<a class="brand-name" href="">{{$totalData['bname']}}</a>
				<p class="market-price">
					<span class="market-title">市场价：</span>
					<span class="has-other-price">¥{{$totalData['marketprice']}}</span>
				</p>
				<p class="sale-price">
					<span class="sale-title">促销价：</span>
					<span class="new-price" price="{{$totalData['shopprice']}}">¥{{$totalData['shopprice']}}</span>
				</p>
				<ul class="activity">
					<li>
						<a class="img-link" href="">
							<img src="./Public/Home/Images/show/4.png">
						</a>
					</li>
					<li>
						<span class="ac-type">满减</span>
						<span class="ac-des">【IN品特享】5折封顶 折后满￥399再减￥50</span>
					</li>
					<li>
						<span class="ac-type">加价购</span>
						<span class="ac-des"> 全场￥99加价购</span>
					</li>
					<li>
						<span class="ac-type">加价购</span>
						<span class="ac-des"> 全场￥49加价购</span>
					</li>
					<li>
						<span class="ac-type">加价购</span>
						<span class="ac-des"> 全场￥29加价购</span>
					</li>
				</ul>
				<div class="trade-content-line"></div>
				<div class="type-chose">
					{{foreach from="$attrData" key="$key" value="$value"}}
					<div class="chose-size">
						<span class="pull-left">选{{$value[0]}}：</span>
						<div id="sizes">
							<ul class="size">
							{{foreach from="$value[1]" key="$k" value="$v"}}
								<li data-name="{{$value['0']}}" class="color-size" gid={{$_GET['gid']}}>{{$v}}</li>
							{{endforeach}}
							</ul>
						</div>
					</div>
					{{endforeach}}	
					<script type="text/javascript">
						$(function(){
							$('.color-size').click(function(){
								var spec = '';
								$.each($('.li-cur'),function(k,v){
									spec += $(this).html()+',';
								});
								// console.log(spec);
								var gid = $(this).attr('gid');
								var price = $('.new-price').attr('price');
								$.ajax({
									type:"post",
									url:"{{U('getSizeAjax')}}",
									data:{spec:spec,gid:gid,price:price},
									dataType:"json",
									success:function(price){
										$('.new-price').html(price);
									}
								});
							})
						})
					</script>
					<div class="chose-count">
						<span class="pull-left">选数量：</span>
						<div class="num-wraper">
							<span id="num" class="num pull-left">1</span>
							<span class="minus-plus">
								<a href="javascript:;" id="chose-plus"></a>
								<a href="javascript:;" id="chose-minus"></a>
							</span>
						</div>
					</div>
					<!-- 选择数量并且将其写入页面中 -->
					<script type="text/javascript">
						$(function(){
							var i = 1;
							$('#chose-plus').click(function(){
								i++;
								$('#num').html(i);
							})
							$('#chose-minus').click(function(){
								if(i<2){
									i=2;
								}
								i--;
								$('#num').html(i);
							})
						})
					</script>
					<p class="add-shop-car">
						<span class="buy-btn" id="addCart" url="{{U('Cart/add',array('gid'=>$_GET['gid']))}}">添加到购物车</span>
						<span class="collect-product">收藏商品</span>
					</p>
					<div class="share-row">
						<span class="pull-left">分享商品：</span>
						<span class="share-to">
							<i class="weibo" title="分享到新浪微博" data-type="weibo">1</i>
							<i class="weixin" title="分享到微信朋友圈" data-type="weixin">2</i>
							<i class="tweibo" title="分享到腾讯微博" data-type="tweibo">3</i>
							<i class="qzone" title="分享到QQ空间" data-type="qzone">4</i>
							<i class="qq" title="分享到QQ好友" data-type="qq">5</i>
							<i class="renren" title="分享到人人" data-type="renren">6</i>
							<i class="douban" title="分享到豆瓣" data-type="douban">7</i>
						</span>
					</div>

					<script type="text/javascript">
						$(function(){
							$('#addCart').click(function(){
								var num = $('#num').html();
								var url = $(this).attr('url');
								var spec = '';
								var  AName = '';
								$.each($('.li-cur'),function(k,v){
									spec += $(this).html()+',';
									AName += $(this).attr('data-name')+',';
								});
								// var size = $('.color-size').html();
								var price = $(".new-price").html();
								var GName = $("#GName").html();
								$.ajax({
									type:"post",
									url:url,
									data:{num:num,spec:spec,price:price,GName:GName,AName:AName},
									dataType:"json",
									success:function(result){
										// console.log(result);//这儿返回的是true说明压入成功
										if(result.status == true){
											console.log(result.total);
											$('#cart-num').html(result.total);
										}
									}
								})
							})
						})
					</script>
				</div>
				<!-- 隐藏域 -->
				<div class="balance">
					<p class="success-tip">商品已成功添加到购物车！</p>
					<p class="cart-total">
						购物车一共有
						<span id="cart-num"></span>
						件商品
					</p>
					<p class="balance-btns">
						<a class="balance-go-cart" href="{{U('Pay/index')}}">去购物车结算</a>
						<span id="keep-shopping" class="keep-shopping">继续购物</span>
					</p>
				</div>
				<!-- 隐藏域结束 -->
			</div>
		</div>
	</div>
	<div id="other-infos">
		<p class="block-title">
			<span class="title block-title-cur">商品信息 DESCRIPTION</span>
			<span class="sep">|</span>
			<span class="title">材质洗涤 MATERIALS</span>
		</p>
		<div class="description-content">
			<ul class="basic">
				<li> 编号: 51285706 </li>
				<li>颜色:
					<span id="desc-color">紫色</span>
				</li>
				<li> 性别: 男款 </li>
				<li> 领型: 圆领 </li>
				<li> 衣长: 适中 </li>
				<li> 袖长: 短袖 </li>
				<li> 版型: 正常 </li>
				<li> 厚度: 中 </li>
				<li> 经典款型: LOGOT恤 </li>
			</ul>
			<ul class="comfort">
				<li class="pull-left">
					<span class="comfort-title">弹性：</span>
					<span class="min-des">小</span>
					<span class="comfort-block "></span>
					<span class="comfort-block cur"></span>
					<span class="comfort-block "></span>
					<span class="comfort-block "></span>
					<span class="comfort-block "></span>
					<span class="max-des">大</span>
				</li>
				<li class="pull-left">
					<span class="comfort-title">厚度：</span>
					<span class="min-des">薄</span>
					<span class="comfort-block "></span>
					<span class="comfort-block "></span>
					<span class="comfort-block cur"></span>
					<span class="comfort-block "></span>
					<span class="comfort-block "></span>
					<span class="max-des">厚</span>
				</li>
				<li class="pull-left">
					<span class="comfort-title">柔软度：</span>
					<span class="min-des">软</span>
					<span class="comfort-block "></span>
					<span class="comfort-block cur"></span>
					<span class="comfort-block "></span>
					<span class="comfort-block "></span>
					<span class="comfort-block "></span>
					<span class="max-des">硬</span>
				</li>
				<li class="pull-left">
					<span class="comfort-title">透气性：</span>
					<span class="min-des">弱</span>
					<span class="comfort-block "></span>
					<span class="comfort-block "></span>
					<span class="comfort-block cur"></span>
					<span class="comfort-block "></span>
					<span class="comfort-block "></span>
					<span class="max-des">强</span>
				</li>
			</ul>
		</div>
	</div>
</article>
 {{include file="../Common/footer"}}
</body>
</html>